/* 清除内外边距 */

body,
h1,
h2,
h3,
h4,
h5,
h6,
hr,
p,
blockquote,







/* structural elements 结构元素 */

dl,
dt,
dd,
ul,
ol,
li,







/* list elements 列表元素 */

pre,







/* text formatting elements 文本格式元素 */

fieldset,
lengend,
button,
input,
textarea,







/* form elements 表单元素 */

th,
td {
    /* table elements 表格元素 */
    margin: 0;
    padding: 0;
}








/* 设置默认字体 */

body,
button,
input,
select,
textarea {
    outline: none;
    /* for ie */
    /*font: 12px/1 Tahoma, Helvetica, Arial, "宋体", sans-serif;*/
    font: 12px/1 Microsoft Yahei, Tahoma, Helvetica, Arial, "\5b8b\4f53", sans-serif;
    /* 用 ascii 字符表示，使得在任何编码下都无问题 */
}

h1 {
    font-size: 18px;
    /* 18px / 12px = 1.5 */
}

h2 {
    font-size: 16px;
}

h3 {
    font-size: 14px;
}

h4,
h5,
h6 {
    font-size: 100%;
}

address,
cite,
dfn,
em,
var {
    font-style: normal;
}








/* 将斜体扶正 */

code,
kbd,
pre,
samp,
tt {
    font-family: "Courier New", Courier, monospace;
}








/* 统一等宽字体 */

small {
    font-size: 12px;
}








/* 小于 12px 的中文很难阅读，让 small 正常化 */


/* 重置列表元素 */

ul,
ol {
    list-style: none;
}








/* 重置文本格式元素 */

a {
    text-decoration: none;
}

a:hover {
    text-decoration: underline;
}

abbr[title],
acronym[title] {
    /* 注：1.ie6 不支持 abbr; 2.这里用了属性选择符，ie6 下无效果 */
    border-bottom: 1px dotted;
    cursor: help;
}

q:before,
q:after {
    content: '';
}








/* 重置表单元素 */

legend {
    color: #000;
}








/* for ie6 */

fieldset,
img {
    border: none;
}








/* img 搭车：让链接里的 img 无边框 */


/* 注：optgroup 无法扶正 */

button,
input,
select,
textarea {
    font-size: 100%;
    /* 使得表单元素在 ie 下能继承字体大小 */
}








/* 重置表格元素 */

table {
    border-collapse: collapse;
    border-spacing: 0;
}








/* 重置 hr */

hr {
    border: none;
    height: 1px;
}

a:hover {
    text-decoration: none;
}

.animate-wrap {
    min-width: 1180px;
}

.w1180 {
    width: 1180px;
    margin: 0 auto;
}

.banner-icon {
    display: inline-block;
    background: url(../images/banner-icon.png) no-repeat;
}

.banner-icon-list {
    width: 24px;
    height: 24px;
    background-position: 0 0;
}

.banner-icon-list1 {
    width: 24px;
    height: 24px;
    background-position: 0 -26px;
}


.animate-banner1-wrap {
    height: 601px;
    background: url(../images/banner1.jpg) 50% 0 no-repeat;
    overflow: hidden;
}

.animate-banner1 {
    position: relative;
    .banner1-phone {
        margin: 80px 0 0 70px;
    }
    .banner1-title {
        position: absolute;
        left: 480px;
        top: 148px;
        color: #fff;
        font-weight: 800;

        .title1 {
            font-size: 36px;
            margin-bottom: 25px;
        }
        .title2 {
            font-size: 60px;
            margin-bottom: 25px;
        }
        .title3 {
            font-size: 24px;
            margin-bottom: 78px;
            font-weight: 600;
        }
    }
    .banner1-ewm {
        position: absolute;
        left: 480px;
        top: 386px;
        img {
            float: left;
        }
        a {
            float: left;
            width: 220px;
            height: 48px;
            color: #fff;
            font-size: 18px;
            padding-left: 68px;
            line-height: 48px;
            margin-left: 18px;
            &.ios {
                background: url(../images/banner1-ios.png) no-repeat;
            }
            &.andorid {
                margin-top: 21px;
                background: url(../images/banner1-andorid.png) no-repeat;
            }
        }
    }
}

// banner2
.animate-banner2-wrap {
    height: 720px;
    background: url(../images/banner2.jpg) 50% 0 no-repeat;
    overflow: hidden;
}

.animate-banner2 {
    height: 720px;

    position: relative;
    .banner2-phone {
        position: absolute;
        right: 90px;
       bottom:-480px;
        &.top {
            bottom:0;
        }
    }
    .banner2-title {
        position: absolute;
        left: 46px;
        top: 480px;
        &.top {
            top: 64px;
        }
    }
    .banner2-list {
        position: absolute;
        left: 65px;
        top:480px;
        &.top{
        top: 422px;

        }
        p {
            height: 60px;
            font-size: 30px;
            font-weight: 800;
        }
        li {
            margin-bottom: 18px;
            color: #8d8d8d;
            font-size: 22px;
            i {
                margin-right: 24px;
                float: left;
            }
        }
    }
}


// banner3
.animate-banner3-wrap {
    height: 600px;
    background: url(../images/banner3.jpg) 50% 0 no-repeat;
    overflow: hidden;
}

.animate-banner3 {
    position: relative;
    height: 600px;

    .banner3-phone {
        position: absolute;
        left: 36px;
        bottom: -400px;
        &.top {
            bottom: 0;
        }
    }
    .banner3-title {
        position: absolute;
        left: 486px;
        top: 400px;
        &.top {
            top: 108px;
        }
    }
    .banner3-list {
        position: absolute;
        left: 480px;
        top: 400px;
        &.top {
            top: 316px;
        }
        p {
            height: 60px;
            font-size: 30px;
            font-weight: 800;
            color: #fff;
        }
        li {
            margin-bottom: 18px;
            color: #fff;
            font-size: 22px;
            opacity: 0.75;
            filter: alpha(opacity=75);
            i {
                margin-right: 24px;
                float: left;
            }
        }
    }
}


// banner4
.animate-banner4-wrap {
    height: 600px;
    background: url(../images/banner4.jpg) 50% 0 no-repeat;
    overflow: hidden;
}

.animate-banner4 {
    height: 600px;

    position: relative;
    .banner4-phone {
        position: absolute;
        right: 60px;
        bottom: -400px;
        &.top {
            bottom:0;
        }
    }
    .banner4-title {
        position: absolute;
        left: 46px;
        top: 400px;

        &.top {
            top: 78px;
        }
    }
    .banner4-list {
        position: absolute;
        top: 400px;
        left: 65px;
        &.top {
            top: 326px;
        }
        p {
            height: 60px;
            font-size: 30px;
            font-weight: 800;
        }
        li {
            margin-bottom: 18px;
            color: #8d8d8d;
            font-size: 22px;
            i {
                margin-right: 24px;
                float: left;
            }
        }
    }
}

// banner5
.animate-banner5-wrap {
    height: 600px;
    background: url(../images/banner5.jpg) 50% 0 no-repeat;
    overflow: hidden;
}

.animate-banner5 {
    position: relative;
    height: 600px;

    .banner5-phone {
        position: absolute;
        left: 36px;
        bottom: -400px;
        &.top{
            bottom:0;
        }
    }
    .banner5-title {
        position: absolute;
        left: 473px;
        top:400px;
        &.top{
        top: 86px;

        }
    }
    .banner5-list {
        position: absolute;
        left: 480px;
        top:400px;
        &.top{
        top: 340px;

        }

        li {
            margin-bottom: 18px;
            color: #fff;
            font-size: 22px;
            opacity: 0.75;
            filter: alpha(opacity=75);
            i {
                margin-right: 24px;
                float: left;
            }
        }
    }
}

// banner6
.animate-banner6-wrap {
    height: 600px;
    background: url(../images/banner6.jpg) 50% 0 no-repeat;
    overflow: hidden;
}

.animate-banner6 {
    height: 600px;
    position: relative;
    .banner6-phone {
        position: absolute;
        right: 60px;
        bottom:-400px;
        &.top{
        bottom: 0;
            
        }
    }
    .banner6-title {
        position: absolute;
        left: 55px;
        top:400px;
        &.top{
        top: 40px;

        }
    }
    .banner6-list {
        position: absolute;
        left: 65px;
        top:400px;
        &.top{
        top: 289px;

        }

        li {
            margin-bottom: 60px;
            color: #242526;
            font-weight: 600;
            font-size: 22px;
            i {

                float: left;
                margin-right: 10px;
            }
            p {
                color: #8d8d8d;
                font-weight: normal;
                margin-top: 16px;
            }
        }
    }
}


// banner7
.animate-banner7-wrap {
    height: 601px;
    background: url(../images/banner7.jpg) 50% 0 no-repeat;
    overflow: hidden;
}

.animate-banner7 {
    position: relative;
    height: 601px;

    .banner7-phone {
        position: absolute;
        left: 36px;
            bottom:-400px;

        &.top{
        bottom: 0;
        }
    }
    .banner7-title {
        position: absolute;
        left: 473px;
        top:400px;
        &.top{
        top: 190px;

        }
    }
    .banner7-list {
        position: absolute;
        left: 480px;
        top:400px;
        &.top{
        top: 350px;

        }

        li {
            margin-bottom: 18px;
            color: #fff;
            font-size: 22px;
            opacity: 0.75;
            filter: alpha(opacity=75);
            i {
                margin-right: 24px;

                float: left;
            }
        }
    }
}